<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=<device-width>, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

     <!--
        form单独存在没有意义，需要借助于子标签input
        1.form标签常见属性：
            1)action="提交数据的服务器地址"
            2)method="提交后台服务器的数据的提交方式或者请求方式"
        2.method的属性值：get  post
            get请求：
                1)不安全的
                2)提交后台服务器的数据位于url后面
                    http://127.0.0.1:端口号/资源?username=zhangsan&password=1234
                3)传输数据大小具有限制
                4)只能传输字符数据
            post请求：http://127.0.0.1:端口号/资源
                1）安全的
                2）提交后台的数据位于请求体中 复习
                3）传输的数据没有大小限制
                4）可以传输字符数据，字节数据
         3.如果数据想要别提交到指定的后台服务器，那么数据必须书写在form标签的文本中
  -->
    <!-- input标签：
        1.属性：
            1）type:表示input标签表示的类型，具有如下属性值：
                a:text 表示文本，默认的
                b:password 表示密码框 自动加密
                c:radio 表示单选按钮，只能选择一个
                d:checkbox:复选框，多选
                e:file:上传的文件
                f:hidden:表示隐藏域，页面上确实存在，但是用户看不到。
                    应用场景：修改商品 删除商品 lakakj1981829191
                g:image:引入图片 一般使用img标签引入图片 了解。
                 这里可以将页面的图片提交到后台服务器
                h:submit:提交表单中的数据到后台服务器
                i:reset:重置，重新输入
                j:button: 按钮

            2）name:
                a:对于单选按钮，我们必须给一个name属性，并且name属性值要一致，这样才可以实现单选
                b:开发中对于name属性我们一定要书写，并且name属性值要和后台即java代码中的标准类中的成员变量名一致
            3）value：
                a:对于input标签中的type属性值：submit  reset  button 可以修改页面显示的内容，显示value中的内容
                b:对于input标签的value属性，我们可以书写可以不书写，对于输入框一般不书写，提交后台服务器的数据就是输入框的数据.
                对于input其他的内容一般都书写value
            4）checked="checked" 属性：针对单选按钮和复选框的，表示默认被选中
            5）readonly="readonly" 属性：针对输入框的，表示只读，不能修改
            6) disabled="disabled" :针对单选按钮和复选框，表示不能操作
            7)size="30px" 表示输入框大小 了解
            8）maxlength="5" 输入框输入的最多的字符个数  了解 -->
    <form action="#" method="get">
        用户名<input type="text" name="username" value="柳岩" readonly size="10px" /><br>
        用户名<input name="username2" maxlength="3" /><br>
        密码<input type="password" name="password" /><br>
        性别：
        <input type="radio" name="sex" checked="checked" disabled>男
        <input type="radio" name="sex">女
        <br>
        爱好：
        <input type="checkbox" checked disabled>登山
        <input type="checkbox" checked="checked" disabled="disabled">篮球
        <input type="checkbox">习武
        <input type="checkbox">皮划艇
        <br>
        您上传的种子文件：<input type="file" />
        <br>
        <input type="hidden" value="iaiauauayyayay">
        <br>
        <!--<input type="image" src="../img/mm.jpg"/>-->
        <input type="submit" value="注册">
        <br>
        <input type="reset">
        <br>
        <input type="button" value="登录">

    </form>

    <!-- 下拉列表标签：select,单独存在没有意义，需要借助子标签option
    2. 子标签option的value属性必须写，提交到后台的就是option的value属性值，如果不书写value，那么
               提交后台的就是文本值
    3. 子标签option的selected属性表示被选中
    4. select标签的属性：
           **1）name:name属性值必须写，这样后台根据name属性值获取选中的option的value属性值**

      ​	2)size="2" 每次select标签中显示2个子标签option  了解
       3）multiple 表示可以显示多个option 了解 -->
    <form action="#">
        <!--<select name="city" size="2">-->
        <select name="city" multiple size="5">
            <option value="">-----------请选择-------------</option>
            <option value="sh">上海</option>
            <option value="bj" selected>北京</option>
            <option value="sz">深圳</option>
            <option value="sz">深圳</option>
            <option value="sz">深圳</option>
            <option value="sz">深圳</option>
            <option value="sz">深圳</option>
            <option value="sz">深圳</option>
            <option value="sz">深圳</option>
            <option value="sz">深圳</option>
            <option value="sz">深圳</option>

        </select>
    </form>

    <!-- 文本域标签：<textarea>
        1.由行rows和列cols组成 -->
    <textarea rows="10" cols="10"></textarea>

    <form action="#" method="post">
        <input type="radio" name="sex" id="male"> <label for="male">男</label>
        <input type="radio" name="sex" id="female"><label for="female">女</label><br>
       <label for="username"> 用户名:</label>
       <input type="text" id="username" placeholder="请输入用户名">
    </form>
</body>


    
</html>